﻿<UserControl x:Class="SlidingPanel.Shell"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:library="clr-namespace:SlidingPanel.Library;assembly=SlidingPanel.Library"
             xmlns:pages="clr-namespace:SlidingPanel.Pages"
             mc:Ignorable="d"
             FontFamily="{StaticResource PhoneFontFamilyNormal}"
             FontSize="{StaticResource PhoneFontSizeNormal}"
             Foreground="{StaticResource PhoneForegroundBrush}">
    <UserControl.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="Margin"
                    Value="12" />
            <Setter Property="FontSize"
                    Value="42" />
            <Setter Property="FontFamily"
                    Value="Segoe WP Light" />
            <Setter Property="TextWrapping"
                    Value="Wrap" />
        </Style>

        <Style TargetType="Button"
               x:Key="SideButtonStyle">
            <Setter Property="Padding" Value="4"/>
            <Setter Property="Margin" Value="-6"/>
            <Setter Property="BorderThickness" Value="0"/>
        </Style>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot"
          Background="Transparent">

        <!-- Main panel contains the navigation frame, you can use side panels for what you want, or maybe only use one -->
        <library:SlidingPanel x:Name="MainPanel">
            <library:SlidingPanel.LeftContent>
                <Grid Background="DeepSkyBlue">
                    <pages:LeftView />
                </Grid>
            </library:SlidingPanel.LeftContent>

            <library:SlidingPanel.RightContent>
                <Grid Background="DeepSkyBlue">
                    <pages:RightView />
                </Grid>
            </library:SlidingPanel.RightContent>

            <library:SlidingPanel.CenterContent>
                <Grid Background="DodgerBlue">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition />
                    </Grid.RowDefinitions>

                    <Grid Background="#10000000">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <Button Style="{StaticResource SideButtonStyle}"
                                Click="LeftPanelButton_OnClick">
                            <Image Source="/Assets/Icons/menu.png"/>
                        </Button>

                        <TextBlock Margin="6,12"
                                   Grid.Column="1"
                                   HorizontalAlignment="Center"
                                   Style="{StaticResource PhoneTextTitle2Style}"
                                   Text="Sliding Panel" />

                        <Button Style="{StaticResource SideButtonStyle}"
                                Grid.Column="2"
                                Click="RightPanelButton_OnClick">
                            <Image Source="/Assets/Icons/menu.png"/>
                        </Button>
                    </Grid>

                    <!-- Navigation frame -->
                    <phone:PhoneApplicationFrame x:Name="MainFrame"
                                                 Grid.Row="1" />
                </Grid>
            </library:SlidingPanel.CenterContent>
        </library:SlidingPanel>

    </Grid>

</UserControl>